<%
# Copyright (C) 2011 - present Instructure, Inc.
#
# This file is part of Canvas.
#
# Canvas is free software: you can redistribute it and/or modify it under
# the terms of the GNU Affero General Public License as published by the Free
# Software Foundation, version 3 of the License.
#
# Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
# WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
# A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
# details.
#
# You should have received a copy of the GNU Affero General Public License along
# with this program. If not, see <http://www.gnu.org/licenses/>.
%>

<% content_for :page_title do %><%= join_title @page.name, @category.name, @portfolio.name %><% end %>
<%
  js_bundle :eportfolio
  css_bundle :tinymce
  @no_left_side_list_view = true
  js_env({ SECTION_COUNT_IDX: @page.content_sections.count })
%>

<% content_for :auto_discovery do %>
  <% if can_do(@portfolio, @current_user, :update) %>
    <%= auto_discovery_link_tag(:atom, feeds_eportfolio_path(@portfolio.id, :atom, :verifier => @portfolio.uuid), {:title => t('titles.feed', "Eportfolio Atom Feed") }) %>
  <% elsif @portfolio.public %>
    <%= auto_discovery_link_tag(:atom, feeds_eportfolio_path(@portfolio.id, :atom), {:title => t('titles.feed', "Eportfolio Atom Feed") }) %>
  <% end %>
<% end %>

<% content_for :left_side do %>
  <div class="eportfolio-name">
    <h3><%= @portfolio.name %></h3>
    <% if @owner_url %>
      <a href="<%= @owner_url %>" id="section-tabs-header-subtitle" class="ellipsis"><%= @portfolio.user.name %></a>
    <% else %>
      <span id="section-tabs-header-subtitle" class="ellipsis"><%= @portfolio.user.name %></span>
    <% end %>
  </div>
  {{> views/eportfolios/section_list}}
<% end %>

<% content_for :right_side do %>
  <div id="page_sidebar">
    <% if can_do(@portfolio, @current_user, :manage) && !@owner_view %>
      <div class="rs-margin-bottom">
        <a href="#" class="wizard_popup_link"><%= help_link_text %></a>
      </div>
    <% end %>
    {{> views/eportfolios/page_list}}
    <% if can_do(@portfolio, @current_user, :manage) && !@owner_view %>
    <div class="edit_content_link_holder">
      <a href="#" class="edit_content_link btn button-sidebar-wide"><%= edit_link_text %></a>
      <a href="<%= eportfolio_path(@portfolio.id) %>" class="icon-arrow-left">{{#t}}Back to Portfolio Dashboard{{/t}}</a>
    </div>
    <div id="edit_page_sidebar">
      <h2 class="header">{{#t}}Add Content{{/t}}</h2>
      <div>
        <ul>
          <li><a class="add_content_link add_rich_content_link" href="#">{{#t}}Rich Text Content{{/t}}</a></li>
          <li><a class="add_content_link add_html_link" href="#">{{#t}}HTML/Embedded Content{{/t}}</a></li>
          <li><a class="add_content_link add_submission_link" href="#">{{#t}}Course Submission{{/t}}</a></li>
          <li><a class="add_content_link add_file_link" href="#">{{#t}}Image/File Upload{{/t}}</a></li>
        </ul>
        <div class="form_content button-container">
          <button type="button" class="cancel_button btn button-secondary btn-small">{{#t}}Cancel{{/t}}</button>
          <button type="button" class="preview_button btn btn-small">{{#t}}Preview{{/t}}</button>
          <button type="button" class="submit_button btn btn-small btn-primary">{{#t}}Save Page{{/t}}</button>
        </div>
        <div class="preview_content button-container">
          <button type="button" class="cancel_button btn button-secondary btn-small">{{#t}}Cancel{{/t}}</button>
          <button type="button" class="keep_editing_button btn btn-small">{{#t}}Keep Editing{{/t}}</button>
          <button type="button" class="submit_button btn btn-small btn-primary">{{#t}}Save Page{{/t}}</button>
        </div>
      </div>
    </div>
    <div style="display: none">
      {{> views/shared/wiki_sidebar}}
    </div>
    <% end %>
  </div>
<% end %>

<% if @owner_view %>
  <h2>{{#t}}Welcome to Your ePortfolio{{/t}}</h2>
  <p><%= t(:welcome, <<-DETAILS)
    If this is your first time here, you may want to pop up the wizard and see
    how best to get started. Otherwise you can quickly add recent submissions
    or just jump straight to the portfolio.
    DETAILS
  %></p>
  <ul class="unstyled_list" style="padding-left: 20px; margin-bottom: 20px; line-height: 1.8em; font-size: 1.2em;">
    <li><a href="#" class="wizard_popup_link icon-question">{{#t}}Getting Started Wizard{{/t}}</a></li>
    <li><a href="?view=preview" class="icon-arrow-right">{{#t}}Go to the Actual ePortfolio{{/t}}</a></li>
  </ul>

  <% if @portfolio.public %>
    <h3>{{#t}}Your ePortfolio is Public{{/t}}</h3>
    <p><%= t(:public_eportfolio, <<-DETAILS,
      That means anyone who knows the address of your portfolio can view it.
      You can make your portfolio private by *changing your portfolio
      settings*.
      DETAILS
      :wrapper => '<a href="#" class="portfolio_settings_link"><b>\1</b></a>') %></p>
  <% else %>
    <h3>{{#t}}Your ePortfolio is Private{{/t}}</h3>
    <p><%= t(:private_eportfolio, <<-DETAILS)
      That means people can't find it or even view it without permission. You
      can see it since it's your portfolio, but if you want to let anybody else
      see it, you'll need to copy and share the the following special link so
      they can access your portfolio:
      DETAILS
    %></p>
    <p>
    {{#t}}Copy and share this link to give others access to your private ePortfolio:{{/t}}<br />
    <a href="<%= eportfolio_path(@portfolio.id, :verifier => @portfolio.uuid) %>" id="eportfolio_share_link">
      <%= eportfolio_url(@portfolio.id, :verifier => @portfolio.uuid) %>
    </a>
    </p>
  <% end %>

  <h3>{{#t}}Recent Submissions{{/t}}</h3>
  <p>{{#t}}Click any submission to add it to a new page in your ePortfolio.{{/t}}</p>
  <% if @portfolio.user.submissions.empty? %>
    <div style="margin: 5px 20px;">{{#t}}No Submissions Found{{/t}}</div>
  <% end %>
  <ul class="submission_list" id="recent_submissions" style="max-height: 200px; overflow: auto;">
    <% @portfolio.user.submissions.each do |submission| %>
      <% already_used = (@used_submission_ids.include?(submission.id) rescue false) %>
      <li class="clearfix submission <%= 'already_used' if already_used %>" title="<%= t('titles.already_used', "This submission is already included in your portfolio") if already_used %>" id="recent_submission_<%= submission.id %>" tabindex="0">
        <a href="<%= eportfolio_entry_preview_submission_path(@portfolio, @page, submission.id) %>"
          style="display: none;"
          class="submission_info">
          <%= submission.assignment.title %>, <%= submission.assignment.context.name %>
        </a>
        <div style="float: right; font-size: 0.8em; color: #aaa; margin-right: 20px; margin-top: 0.5em;">
          <%= datetime_string(submission.submitted_at || submission.updated_at) %>
          &nbsp;<a href="<%= context_url(submission.assignment.context, :context_assignment_submission_url, submission.assignment_id, @portfolio.user.id) %>" target="_blank" class="no-hover view_submission_url"><%= image_tag "popout.png", :alt => t('titles.view_submission', "View the Submission") %></a>
        </div>
        <span class="text" style="font-size: 1.2em;">
          <span class="text assignment_title"><%= submission.assignment.title %></span>
          <span style="font-size: 0.8em; padding-left: 5px;" class="text context_name"><%= submission.assignment.context.name %></span>
        </span>
        <div style="font-size: 0.8em; color #aaa; margin-left: 20px;">
          <%= t(:attachment_count, { :one => "1 Attachment", :other => "%{count} Attachments" },
                :count => submission.attachments.length) unless submission.attachments.empty? %></div>
        <span class="submission_id" style="display: none;"><%= submission.id %></span>
        <div class="clear"></div>
      </li>
    <% end %>
  </ul>
  <ul id="eportfolio_structure" style="display: none;">
    <% @portfolio.eportfolio_categories.each do |category| %>
      <li id="structure_category_<%= category.id %>" class="category">
        <ul class="entry_list">
          <% category.eportfolio_entries.each do |entry| %>
          <li id="structure_entry_<%= entry.id %>" class="entry">
            <span class="name"><%= entry.name %></span>
          </li>
          <% end %>
        </ul>
        <span class="name"><%= category.name %></span>
      </li>
    <% end %>
    <li id="structure_category_blank" class="category">
      <ul class="entry_list">
      </ul>
      <span class="name">&nbsp;</span>
    </li>
    <li id="structure_entry_blank" class="entry">
      <span class="name">&nbsp;</span>
    </li>
  </ul>
  <form id="add_submission_form" style="display: none;">
    <input type="hidden" name="section_1[section_type]" value="rich_text"/>
    <input type="hidden" name="section_1[content]" class="submission_description" value=""/>
    <input type="hidden" name="section_2[section_type]" value="submission"/>
    <input type="hidden" name="section_2[submission_id]" class="submission_id" value=""/>
    <input type="hidden" name="section_count" value="2"/>
    <p style="font-size: 0.8em;"><%= t(:add_submission, <<-INSTRUCTIONS)
      To make a new page for this submission, select a section and enter the
      name for the new page.
      INSTRUCTIONS
    %></p>
    <table class="formtable">
      <tr>
        <td><%= before_label(:section, "Section") %></td>
        <td>
          <select id="category_select" name="eportfolio_entry[eportfolio_category_id]">
            <% @portfolio.eportfolio_categories.each do |category| %>
              <option value="<%= category.id %>" id="category_select_<%= category.id %>"><%= category.name %></option>
            <% end %>
          </select>
          <div style="display: none;">
            <option value="new" id="category_select_blank">
              {{#t}}New Section{{/t}}
            </option>
          </div>
        </td>
      </tr><tr>
        <td><%= before_label(:page_name, "Page Name") %></td>
        <td><input type="text" name="eportfolio_entry[name]" style="width: 100px;"/></td>
      </tr><tr>
        <td colspan="2" style="padding-left: 20px; font-size: 0.8em; padding-top: 10px;">
          {{#t}}Current Pages{{/t}}
          <ul id="page_select_list" class="unstyled_list" style="padding-left: 20px; margin-top: 5px;">
            <li class="page_select" id="page_select_blank" style="display: none;">
            </li>
          </ul>
        </td>
      </tr>
    </table>
    <div class="button-container">
      <button type="button" class="btn cancel_button">{{#t}}Cancel{{/t}}</button>
      <button type="submit" class="btn btn-primary">{{#t}}Add Page{{/t}}</button>
    </div>
    <div style="display: none;">
      <a class="add_eportfolio_entry_url" href="<%= eportfolio_entries_path(@portfolio.id) %>">&nbsp;</a>
      <a class="eportfolio_named_entry_url" href="<%= eportfolio_named_category_entry_path(@portfolio.id, "{{ category_slug }}", "{{ slug }}") %>">&nbsp;</a>
    </div>
  </form>
<% else %>
  <% if can_do(@portfolio, @current_user, :manage) %>
  <div style="float: right; display: none;"><a href="#" class="edit_content_link icon-edit"><%= edit_link_text %></a></div>
  <% end %>
  <h2 id="eportfolio_entry_<%= @page.id %>"><span class="name"><%= @page.name %></span></h2>
  <%= form_for @page, :url => eportfolio_entry_url(@portfolio, @page), :html => {:id => "edit_page_form" } do |f| %>
  <div class="form_content">
    <%= f.label :name, before_label(:page_name, "Page Name") %>
    <%= f.text_field :name %>
  </div>
  <div id="page_content">
    <% @page.content_sections.each_with_index do |c, idx| %>
      {{> views/eportfolios/page_section}}
    <% end %>
  </div>
  <div class="form_content">
    <%= f.check_box :allow_comments, :class => "allow_comments" %>
    <%= f.label :allow_comments, t('labels.allow_comments', "Allow Comments on this Page") %>
    <div style="margin-left: 40px;" class="show_comments_box <%= "disabled" unless @page.allow_comments %>">
      <%= f.check_box :show_comments, :class => "show_comments" %>
      <%= f.label :show_comments, t('labels.show_comments', "Make Comments Public") %>
    </div>
  </div>
  <div class="form_content button-container">
    <button type="button" class="cancel_button btn button-secondary">{{#t}}Cancel{{/t}}</button>
    <button type="button" class="preview_button btn">{{#t}}Preview{{/t}}</button>
    <button type="submit" class="btn btn-primary">{{#t}}Save Page{{/t}}</button>
  </div>
  <div class="preview_content button-container">
    <button type="button" class="cancel_button btn button-secondary">{{#t}}Cancel{{/t}}</button>
    <button type="button" class="keep_editing_button btn">{{#t}}Keep Editing{{/t}}</button>
    <button type="submit" class="btn btn-primary">{{#t}}Save Page{{/t}}</button>
  </div>
  <table class="formtable" style="width: 100%; display: none;">
    <tr>
      <td colspan="2">
        <div style="text-align: right; margin-right: 5%; font-size: 0.8em;">
          <a href="#" class="switch_views_link"><%= t '#editor.switch_editor_html', "HTML Editor" %></a>
          <a href="#" class="switch_views_link" style="display:none;"><%= t '#editor.switch_editor_rich_text', "Rich Content Editor" %></a>
        </div>
        <%= f.text_area :content, :id => "edit_page_content", :style => "width: 98%; height: 300px;" %>
      </td>
    </tr><tr>
    </tr>
  </table>
  <% end %>
  {{> views/eportfolios/page_section", :object => nil, :locals => {:idx => "blank}}
  <% if can_do(@portfolio, @current_user, :manage) %>
  <div id="edit_content_templates" style="display: none;">
    <div class="edit_rich_text_content form_content" style="display: none;">
      <textarea class="edit_section" id="edit_section_blank" style="width: 95%; margin-left: auto; margin-right: auto; height: 200px;"></textarea>
    </div>
    <div class="edit_html_content form_content" style="display: none;">
      <%= before_label(:html_content, "Copy and paste your HTML code into the box below") %><br/>
      <textarea class="edit_section" id="edit_html_section_blank" style="width: 95%; margin-left: auto; margin-right: auto; height: 150px;"></textarea>
    </div>
    <div class="edit_submission_content form_content" style="display: none;">
      <%= before_label(:choose_submission, "Select an assignment submission to embed in this page") %><br/>
      <% if @portfolio.user.submissions.empty? %>
        <div style="margin: 5px 20px;">{{#t}}No Submissions Found{{/t}}</div>
      <% end %>
      <ul class="submission_list">
        <% @portfolio.user.submissions.each do |submission| %>
          <li class="submission <%= 'already_used' if (@used_submission_ids.include?(submission.id) rescue false) %>" id="submission_<%= submission.id %>">
            <a href="<%= eportfolio_entry_preview_submission_path(@portfolio, @page, submission.id) %>"
              style="display: none;"
              class="submission_info">
              <%= submission.assignment.title %>, <%= submission.assignment.context.name %>
            </a>
            <span role="button" tabindex="0" class="text" style="font-size: 1.2em;">
              <%= submission.assignment.title %>, <%= submission.assignment.context.name %>
              <span class="screenreader-only">
                <%=t "click to select" %>
              </span>
            </span>
            <div style="float: right; font-size: 0.8em; color: #aaa; margin-right: 20px; margin-top: 0.5em;"><%= datetime_string(submission.submitted_at || submission.updated_at) %></div>
            <div style="font-size: 0.8em; color #aaa; margin-left: 20px;">
              <%= t(:attachment_count, { :one => "1 Attachment", :other => "%{count} Attachments" },
                    :count => submission.attachments.length) unless submission.attachments.empty? %></div>
            <div class="clear"></div>
          </li>
        <% end %>
      </ul>
      <div class='button-container button-container-right-aligned clearfix'>
        <button type="button" class="cancel_content_button btn button-secondary btn-small">
          {{#t}}Cancel{{/t}}
        </button>
        <button type="button" class="select_submission_button btn btn-primary btn-small">
          {{#t}}Select Submission{{/t}}
        </button>
      </div>
    </div>
    <div class="edit_attachment_content form_content" style="display: none;">
      <div style="width: 400px; margin: 0 auto; text-align: left;">
        <%= before_label(:file_select, "Select a file to include on this page") %><br/>
        <div class="file_list" style="margin-left: 50px; max-height: 200px; overflow: auto;">
          <b><%= t(:no_files, "No Files Uploaded") if @portfolio.user.attachments.active.empty? %></b>
          <% unless @portfolio.user.attachments.active.empty? %>
            {{> views/files/nested_content}}
          <% end %>
        </div><br/>
        <%= before_label(:file_upload, "Or upload a new file") %><br/>
        <%= file_field :attachment, :uploaded_data, :class => "file_upload", :style => "padding-left: 50px;" %>
        <div style="font-size: 0.8em; margin-left: 20px;">
          <%= t("%{file_size_limit} user file quota applies",
                file_size_limit: number_to_human_size(@current_user.quota)) %>
        </div>
      </div>
      <div class='button-container button-container-right-aligned'>
        <button type="button" class="upload_file_button btn btn-small">{{#t}}Select/Upload File{{/t}}</button>
        <button type="button" class="cancel_content_button btn btn-small">{{#t}}Cancel{{/t}}</button>
      </div>
    </div>
    <div class="loading_submission" style="text-align: center;">
      <%= image_tag "ajax-loader-bar.gif", :alt => '' %><br/>
      <%= before_label(:loading_submission, "Loading Submission") %><span class="submission_name">&nbsp;</span>...
    </div>
    <div class="uploading_file" style="text-align: center;">
      <%= image_tag "ajax-loader-bar.gif", :alt => '' %><br/>
      <%= before_label(:uploading_file, "Uploading") %><span class="file_name">&nbsp;</span>...
    </div>
    <%= form_for :attachment, :url => context_url(@portfolio.user, :controller => :files, :action => :create, :format => "text"), :html => {:id => "upload_file_form"} do |f| %>
    <% end %>
    <iframe class="submission_preview" style="border: 1px solid #aaa; width: 95%; height: 300px; display: block; margin-left: auto; margin-right: auto;" src="about:blank" title="{{#t}}Preview{{/t}}">
    </iframe>
  </div>
  <div style="display: none;">
    <% @files.each do |file| %>
      <div id="file_uuid_<%= file.id %>"><%= file.uuid %></div>
    <% end %>
  </div>
  <% end %>

<% end %>
<%= form_for @portfolio, :url => eportfolio_path(@portfolio), :html => {:style => "display: none; position: relative;", :id => "edit_eportfolio_form"} do |f| %>
<table class="formtable">
  <tr>
    <td><%= f.label :name, before_label(:eportfolio_name, "ePortfolio Name") %></td>
    <td><%= f.text_field :name %></td>
  </tr><tr>
    <td colspan="2">
      <%= f.check_box :public %>
      <%= f.label :public, t('labels.make_public', "Make it Public") %>
    </td>
  </tr>
  <tr>
    <td colspan="2" class="button-container">
      <button type="submit" class="btn btn-primary">{{#t}}Update ePortfolio{{/t}}</button>
      <button class="btn dialog_closer">{{#t}}Cancel{{/t}}</button>
    </td>
  <td>
</table>
<% end %>
<% if !@owner_view %>
<div id="page_comments_holder" style="margin-top: 50px;">
  <h2 style="<%= hidden unless @page.show_comments || @page.allow_comments || can_do(@portfolio, @current_user, :update) %>"><%= t 'headings.page_comments', 'Page Comments' %></h2>
  <% if @page.show_comments || can_do(@portfolio, @current_user, :update) %>
    <% if !@page.page_comments.empty? && !@page.show_comments %>
      <p><%= t(:private_comments, <<-DETAILS,
        Right now only you can see the comments for this page. You can make the
        comments public if you like by *changing the settings for this page*.
        DETAILS
        :wrapper => '<a href="#" class="edit_content_link"><b>\1</b></a>') %></p>
    <% end %>
    <div id="page_comments" style="padding: 5px 20px;">
      <%= t(:no_comments, "No Comments") if @page.page_comments.empty? %>
      {{> views/eportfolios/page_comment}}
    </div>
    {{> views/eportfolios/page_comment}}
  <% elsif @page.allow_comments %>
    <p><%= t(:write_only_comments, <<-DETAILS)
      Comments for this page are private. You can make comments, but only the
      portfolio's owner will be able to see them.
      DETAILS
    %></p>
  <% end %>
  <% if @page.allow_comments %>
    <%= form_for :page_comment, :url => eportfolio_entry_page_comments_path(@portfolio.id, @page.id), :html => {:id => "add_page_comment_form", :style => "margin-top: 20px;"} do |f| %>
      <h3><%= before_label(:add_comment, "Add a New Comment") %></h3>
      <% if @current_user %>
        <%= f.text_area :message, :style => "width: 400px; height: 75px;" %>
        <div class="button-container">
          <button type="submit" class="btn btn-primary">{{> icons/discussion}} {{#t}}Add Comment{{/t}}</button>
        </div>
      <% else %>
        <div style="text-align: center; font-size: 1.2em; margin: 10px;">
          <%= t(:login_required, "You must be *logged in* to make comments on this page.",
                :wrapper => "<a href=\"#{login_path}\"><b>\\1</b></a>") %>
        </div>
      <% end %>
    <% end %>
  <% end %>
</div>
<% end %>
<% if @owner_view %>
  <div style="text-align: left; font-size: 1.2em; margin: 30px 10px 0;">
    <a href="<%= eportfolio_export_portfolio_path(@portfolio.id) %>" class="download_eportfolio_link icon-zipped">{{#t}}Download the contents of this ePortfolio as a zip file{{/t}}</a>
    <div style="display: none; font-size: 1.2em;" id="downloading_eportfolio_message">
      <span class="message">
        {{#t}}Collecting ePortfolio resources. this may take a while if you have a lot of files in your ePortfolio.{{/t}}
      </span>
      <div style="margin: 20px 10px;">
        <div id="export_progress"></div>
      </div>
    </div>
  </div>
  <div style="text-align: left; font-size: 1.2em; margin: 30px 10px 0;">
    <a href="<%= eportfolio_url(@portfolio.id) %>" class="delete_eportfolio_link icon-trash">{{#t}}Delete this ePortfolio{{/t}}</a>
  </div>
  <%= form_tag eportfolio_url(@portfolio.id), {:method => :delete, :id => "delete_eportfolio_form", :style => "margin-top: 20px; margin-left: 20px; display: none;"} do %>
    <%= t(:delete_confirm, {
        :one => "You currently have 1 page in this ePortfolio. Are you sure you want to delete the entire ePortfolio?",
        :other => "You currently have %{count} pages in this ePortfolio. Are you sure you want to delete the entire ePortfolio?"
      }, :count => @portfolio.eportfolio_entries.count) %>
    <div class="button-container">
      <button type="submit" class="btn">{{#t}}Delete ePortfolio{{/t}}</button>
      <button type="button" class="btn button-secondary delete_eportfolio_link">{{#t}}Cancel{{/t}}</button>
    </div>
  <% end %>
<% end %>
<div style="display: none;">
  <a href="<%= eportfolio_entry_view_file_path(@portfolio.id, @page.id, "{{ uuid }}") %>" class="eportfolio_download_url">&nbsp;</a>
  <div id="eportfolio_category_id"><%= @category.id %></div>
  <div id="eportfolio_view_image" style="text-align: center;">
    <a href="#" class="eportfolio_download" title="{{#t}}View the Original File{{/t}}"><img src="" class="eportfolio_image"/><a/>
  </div>
  <div id="eportfolio_download_file" style="text-align: center;">
    <a href="#" class="eportfolio_download"><%= t('links.download_file', "Click here to download %{filename}", :filename => raw('<span class="filename">&nbsp;</span>')) %></a>
  </div>
</div>

{{> views/eportfolios/wizard_box}}
